<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!-- import CSS -->
    {#<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">#}
    {#<link rel="stylesheet" href="https://unpkg.com/element-ui@2.4.8/lib/theme-chalk/display.css">#}

    <link rel="stylesheet" href="/ele/lib/index.css">
    <link rel="stylesheet" href="/ele/lib/display.css">
    <link rel="stylesheet" href="/ele/css/app.css">
    <link rel="stylesheet" href="/ele/css/test.css">
</head>
<body class="fs12">

{#<el-row :gutter="20">#}
    {#<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>#}
    {#<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>#}
    {#<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>#}
    {#<el-col :span="6"><div class="grid-content bg-purple"></div></el-col>#}
{#</el-row>#}

{#<style>#}
    {#.el-row {#}
        {#margin-bottom: 20px;#}
    {#&:last-child {#}
         {#margin-bottom: 0;#}
     {#}#}
    {#}#}
    {#.el-col {#}
        {#border-radius: 4px;#}
    {#}#}
    {#.bg-purple-dark {#}
        {#background: #99a9bf;#}
    {#}#}
    {#.bg-purple {#}
        {#background: #d3dce6;#}
    {#}#}
    {#.bg-purple-light {#}
        {#background: #e5e9f2;#}
    {#}#}
    {#.grid-content {#}
        {#border-radius: 4px;#}
        {#min-height: 36px;#}
    {#}#}
    {#.row-bg {#}
        {#padding: 10px 0;#}
        {#background-color: #f9fafc;#}
    {#}#}
{#</style>#}

{#<div id="app">#}

    {#<el-container>#}
        {#<el-header class="bdso tac">Header</el-header>#}
        {#<el-container class="">#}
            {#<el-aside :span="1" class="bc2">Aside</el-aside>#}
            {#<el-main :span="10" class="bc1">Main</el-main>#}
        {#</el-container>#}
    {#</el-container>#}


{#</div>#}

<div id="app">
    <template>
        <el-radio-group v-model="tabPosition" style="margin-bottom: 30px;">
            <el-radio-button label="top">top</el-radio-button>
            <el-radio-button label="right">right</el-radio-button>
            <el-radio-button label="bottom">bottom</el-radio-button>
            <el-radio-button label="left">left</el-radio-button>
        </el-radio-group>

        <el-tabs :tab-position="tabPosition" style="height: 200px;">
            <el-tab-pane label="用户管理">用户管理11111111111</el-tab-pane>
            <el-tab-pane label="配置管理">配置管理</el-tab-pane>
            <el-tab-pane label="角色管理">角色管理</el-tab-pane>
            <el-tab-pane label="定时任务补偿">定时任务补偿</el-tab-pane>
        </el-tabs>
    </template>
</div>

{#<el-container>#}
    {#<el-header>header</el-header>#}
    {#<el-container>#}
        {#<el-aside>aside</el-aside>#}
        {#<el-main>main</el-main>#}
    {#</el-container>#}
{#</el-container>#}
{#<div id="app">#}
    {#<el-row class="bdso pad10 round3 bc3 c13">#}
        {#<el-col :span="24">#}
            {#<div>test24</div>#}
        {#</el-col>#}
    {#</el-row>#}
    {#<div class="el-row"></div>#}
    {#<el-button @click="visible = true" class="hidden-md-and-down">Button</el-button>#}
    {#<el-dialog :visible.sync="visible" title="Hello world">#}
        {#<p>Try Element</p>#}
    {#</el-dialog>#}
{#</div>#}
</body>
<!-- import Vue before Element -->
{#<script src="https://unpkg.com/vue/dist/vue.js"></script>#}
<!-- import JavaScript -->
{#<script src="https://unpkg.com/element-ui/lib/index.js"></script>#}
<script src="/ele/lib/vue.js"></script>
<script src="/ele/lib/index.js"></script>
<script src="/ele/js/main.js"></script>
<script>
    new Vue({
        el: '#app',
        data: function() {
            return {
                tabPosition: 'top'
            };
        }
    })
</script>


<script>
//    export default {
//        data () {
//            return {
//                radio: '1'
//            };
//        }
//    }
</script>

</html>